<template>
	<view class="">
		<!-- 顶部个人信息 -->
		<view class="bg-white">
			<view class="flex padding">
				<view class="padding-lr-xs">
					<view class="cu-avatar lg round"
						style="background-image:url(https://image.meiye.art/Fha6tqRTIwHtlLW3xuZBJj8ZXSX3?imageMogr2/thumbnail/450x/interlace/1);">
					</view>
				</view>
				<view class="padding-xs text-xl text-black">
					<view>{{ userInfo.name }}</view>
					<!-- 认证这个地方给个三元判断，如果没认证显示前去认证，如果已经认证了显示已认证，审核中则提示审核中 -->
					<view class="cu-tag round line-green sm" @tap="authentication()" v-if="userInfo.examineState == 0">前去认证</view>
					<view class="cu-tag round line-green sm" v-if="userInfo.examineState == 1">已认证</view>
				</view>
			</view>
		</view>
		<!-- 基本数据 -->
		<view class="cu-list grid col-3 no-border padding-lr-xs radius-lg-bottom">
			<view class="cu-item" hover-class="hover-class" hover-stay-time="150">
				<view>
					<u-count-to :start-val="0" separator="," bold :end-val="allNumber"></u-count-to>
				</view>
				<text>累积抢单</text>
			</view>
			<view class="cu-item" hover-class="hover-class" hover-stay-time="150">
				<view>
					<u-count-to :start-val="0" separator="," bold :end-val="nowNumber"></u-count-to>
				</view>
				<text>今日抢单</text>
			</view>
			<view class="cu-item">
				<view>
					<u-count-to :start-val="0" separator="," bold :end-val="balanceNumber"></u-count-to>
				</view>
				<text>我的余额</text>
			</view>
		</view>
		<view class="margin-top-sm padding-lr-xs">
			<view class="bg-brown light radius-lg shadow-blur">
				<view class="flex padding-tb-sm padding-lr-sm justify-between">
					<view class="padding-xs">
						<view>点击此处可以查看余额详细信息哦~</view>
					</view>
					<view class="">
						<view class="cu-btn round bg-black" hover-class="hover-class" hover-stay-time="150"
							@tap="$ut.route('pages/withdraw/index/index')">马上提现</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 常用功能 -->
		<view class="cu-bar margin-lr-xs margin-top-sm grid col-4 no-border bg-white radius-lg-top">
			<view class="action">
				<text class="text-xl text-black">我的工单</text>
			</view>
			<view class="action" @tap="$ut.route('pages/index/index')">
				<text class="text-lg">抢单中心<text class="cuIcon-right"></text></text>
			</view>
		</view>
		<view class="cu-list grid col-3 no-border text-black margin-lr-xs padding-bottom radius-lg-bottom">
			<view class="cu-item" v-for="(item,index) in iconList" :key="index" @tap="navToIndex(index)">
				<view :class="['cuIcon-'+item.icon,'text-'+item.color,'text-shadow']" style="font-size: 56rpx;">
					<view class="cu-tag badge" v-if="item.badge!=0">
						<block v-if="item.badge!=1">{{item.badge>99?"99+":item.badge}}</block>
					</view>
				</view>
				<text>{{item.name}}</text>
			</view>
		</view>
		<!-- 其他功能 -->
		<view class="cu-bar margin-lr-xs margin-top grid col-4 no-border bg-white radius-lg-top">
			<view class="action">
				<text class="text-xl">其他功能</text>
			</view>
		</view>
		<view class="cu-list grid col-3 no-border text-black margin-lr-sm padding-bottom radius-lg-bottom">
			<view class="cu-item" v-for="(item,index) in iconOtherList" :key="index" :bindtap="item.bindtap"
				@tap="navTo(item.bindtap)">
				<view :class="['cuIcon-'+item.icon,'text-'+item.color,'text-shadow']" style="font-size: 56rpx;">
					<view class="cu-tag badge" v-if="item.badge!=0">
						<block v-if="item.badge!=1">{{item.badge>99?"99+":item.badge}}</block>
					</view>
				</view>
				<text>{{item.name}}</text>
			</view>
		</view>

		<view class="mx-32 my-60 pb-60">
			<u-button type="primary" @tap="loginOut()">退出登录</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:{},//用户信息
				iconList: [{
						icon: 'moneybagfill',
						color: 'blue',
						name: '抢单大厅',
						bindtap: "moneybagfill"
					}, {
						icon: 'presentfill',
						color: 'red',
						name: '配送中',
						bindtap: "bindZan"
					}, {
						icon: 'formfill',
						color: 'purple',
						name: '已完成',
						bindtap: "showResource"
					},
					// {
					// 	icon: 'shopfill',
					// 	color: 'green',
					// 	badge: 0,
					// 	name: '已取消',
					// 	bindtap: "bindPoint"
					// },
				],
				iconOtherList: [{
					icon: 'same',
					color: 'blue',
					badge: 0,
					name: '审核记录',
					bindtap: "examineList"
				}],
				nowNumber:0,
				allNumber:0,
				balanceNumber:0,
			}
		},
		onShow(){
			this.getRefrom();
		},
		onLoad(){
			this.userInfo = uni.getStorageSync('userInfo');
			console.log(this.userInfo);
		},
		methods: {
			getRefrom(){
				this.$u.api.getDayRobOrder({
					id:uni.getStorageSync('userInfo').id
				}).then(res=>{
					this.nowNumber = res.data;
				})
				this.$u.api.getAllRobOrder({
					id:uni.getStorageSync('userInfo').id
				}).then(res=>{
					this.allNumber = res.data;
				})
				this.$u.api.getDayRobOrderBalance({
					id:uni.getStorageSync('userInfo').id
				}).then(res=>{
					this.balanceNumber = res.data;
				})
				
			},
			navToIndex(key) {
				console.log("userInfo",this.userInfo);
				if(this.userInfo.workType != null){
					this.$ut.route('pages/index/index', {
						current: key
					}, 'reLaunch');
				}else{
					this.$u.toast('未完成审核，无法进行抢单!');
				}
			},
			// 退出登录
			loginOut() {
				this.$ut.route('pages/login/login', {}, 'reLaunch');
			},
			authentication() {
				if (false) return this.$u.toast('已完成认证!');
				if (false) return this.$u.toast('审核中...');
				this.$ut.route('pages/authentication/add/index');
			},
			navTo(bindtap) {
				console.log("bindtap",bindtap);
				if (bindtap == 'examineList') {
					this.$ut.route('pages/authentication/list/index');
				}
				else if(bindtap == 'service'){
					// #ifndef H5
					uni.makePhoneCall({
						phoneNumber: 110,
						success: function() {
							uni.showToast({
								title: '请稍等，拨通中',
								duration: 1200
							});
						},
						fail: function() {
							uni.showToast({
								title: '您已取消拨打',
								duration: 1200
							});
						}
					})
					// #endif
					// #ifdef H5
					window.location.href = 'tel:'+ 110;
					// #endif
				}else if(bindtap == 'complaint'){
					this.$u.toast('开发中...')
				}else{
					this.$u.toast('开发中...')
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "/static/colorui/main.css";
	@import "/static/colorui/icon.css";
</style>